<template>
    <div>
        <div>
            <div style="">
                <Modal v-model="modalSs11006" :title="title" width="900" cancel-text="关闭" style="position:relative;">
                    <Form :disabled=true ref="dataSs11006" :model="dataSs11006" :rules="rules" inline :label-width="160">
                        <table style="width:100%;">
                            <tr>
                                <td style="">
                                    <FormItem label="人员姓名" prop="ssbd0001">
                                        <dictSelect :sel_val='dataSs11006.ssbd0001' dicType="service"
                                                    :bindData.sync="dataSs11006.ssbd0001" :serviceParam="serviceParam"
                                                    dictService="/api/ac/subsistence/ss15002Service/getAssistanceMemberList"
                                                    class="itemStyle" style="width: 200px"    />
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="财产类型" prop="ssbd0002">
                                        <dictSelect :sel_val='dataSs11006.ssbd0002' dictCode="possessiontype"
                                                    :bindData.sync="dataSs11006.ssbd0002" style="width: 200px"
                                                    clearable   />
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="财产明细类:" prop="ssbd0011">
                                        <!--                                        家庭经营性财产-->
                                        <div id="a">
                                            <dictSelect :sel_val='dataSs11006.ssbd0011' dictCode="operationalproperty"
                                                        v-if="operationalpropertytype"
                                                        :bindData.sync="dataSs11006.ssbd0011" style="width: 200px"
                                                        clearable   />
                                        </div>
                                        <!--                                        家庭高档消费品-->
                                        <div id="b">
                                            <dictSelect :sel_val='dataSs11006.ssbd0011' dictCode="consumergoods"
                                                        v-if="consumergoodstype"
                                                        :bindData.sync="dataSs11006.ssbd0011" style="width: 200px"
                                                        clearable   />
                                        </div>
                                        <!--                                        其他家庭财产-->
                                        <div id="c">
                                            <dictSelect :sel_val='dataSs11006.ssbd0011' dictCode="otherproperty"
                                                        v-if="otherpropertytype"
                                                        :bindData.sync="dataSs11006.ssbd0011" style="width: 200px"
                                                        clearable   />
                                        </div>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="财产明细类说明" prop="ssbd0012">
                                        <Input v-model="dataSs11006.ssbd0012" placeholder=""
                                               style="width: 200px"   ></Input>
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="财产总估值" prop="ssbd0005">
                                        <Input v-model="dataSs11006.ssbd0005" placeholder="" style="width: 200px"
                                               type="number" ></Input>
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="是否计入个人收入" prop="ssbd0006">
                                        <dictSelect :sel_val='dataSs11006.ssbd0006' dictCode="yesorno"
                                                    :bindData.sync="dataSs11006.ssbd0006" style="width: 200px"
                                                    clearable   />
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="计入开始时间">
                                        <DatePicker type="date"  v-model="dataSs11006.ssbd0009" style="width: 200px"
                                                    :editable="false" ></DatePicker>
                                        <!--                                        <DatePicker type="date" placeholder="Select date" style="width: 200px"></DatePicker>-->
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="计入月数">
                                        <Input v-model="dataSs11006.ssbd0008"
                                               style="width: 200px"   />
                                    </FormItem>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <FormItem label="计入结束时间">
                                        <DatePicker type="date" v-model="dataSs11006.ssbd0010" style="width: 200px"
                                                        />
                                    </FormItem>
                                </td>
                                <td>
                                    <FormItem label="月计入个人收入金额">
                                        <Input v-model="dataSs11006.ssbd0007"
                                               style="width: 200px"   />
                                    </FormItem>
                                </td>
                            </tr>
                        </table>
                    </Form>
                    <div slot="footer">
                        <Button type="text" size="large" @click="modalSs11006 = false">关闭</Button>
                    </div>
                </Modal>
            </div>
            <div style="margin-top:10px ">
                <vxe-table border
                           auto-resize
                           row-id="id"
                           :row-key="true"
                           show-overflow="tooltip"
                           highlight-hover-row
                           align="center"
                           header-align="center"
                           ref="xTree"
                           :loading="Loading"
                           :data="tableData">
                    <vxe-table-column field="ssbd0001_name" title="人员姓名 " align="center" min-width="100"/>
                    <vxe-table-column field="ssbd0002_name" title="财产类型" align="center" min-width="200"/>
                    <vxe-table-column field="ssbd0005" title="财产总估值" align="center" min-width="200"/>
                    <vxe-table-column field="ssbd0006_name" title="是否计入个人收入" align="center" min-width="200"/>
                    <vxe-table-column field="ssbd0009" title="计入开始时间" align="center" min-width="150" :formatter="renderTime"/>
                    <vxe-table-column field="ssbd0010" title="计入结束时间" align="center" min-width="150" :formatter="renderTime"/>
                    <vxe-table-column field="ssbd0008" title="计入月数" align="center" min-width="200"/>
                    <vxe-table-column field="ssbd0007" title="月计入个人收入金额" align="center" min-width="200"/>
                    <vxe-table-column title="操作" align="center" fixed="right" min-width="200">
                        <template #default="{row}">
                            <Button type="success" size="small" @click="handleDetail(row)" style="margin-left:5px">详情
                            </Button>
                        </template>
                    </vxe-table-column>
                </vxe-table>
                <Page :total="dataCount" :page-size="pageSize" show-total class="paging"
                      @on-change="handleTableChange" :current="pageNo"></Page>
            </div>
        </div>
    </div>
</template>
<script>
    import {getCityDBAppraising} from '@/api/subsistenceAlowances'
    import {date2str, iteminf, updateOrder} from '@/api/eventlist'
    import {CommonMixin} from '@/views/common/js/CommonMixin'
    import dictSelect from '@/components/dictSelect/dictSelect.vue'
    import {postAction} from '@/api/request'
    import DateFormat from '@/plugins/format.js'

    export default {
        created() {
            let that = this;
            that.familyInfo = that.$parent.familyInfo;
            that.ss11001Id = that.familyInfo.ssca0001;
            that.queryParam.azcp0500 = that.ss11001Id;
            this.loadData();
            that.serviceParam.azcp0500 = that.ss11001Id;
        },
        mixins: [CommonMixin],
        components: {
            dictSelect,
        },
        data() {
            return {
                title: '',
                otherpropertytype: false,
                operationalpropertytype: true,
                consumergoodstype: false,
                ssbd0011type: '',
                ss11001Id: '',
                familyInfo: {},
                serviceParam: {
                    azcp0500: ''
                },
                queryParam: {},
                medicalInsuranceState: true, //医保联动状态
                disableSubmit: false,
                modalSs11006: false,
                dataSs11006: {
                    ssbd0011: '',
                },
                tableData: [],
                btnLoading: false,
                Loading: false,
                family_url: '',
                support_id: '',
                family_idInfo: {},
                next_params: {},
                property_url: '',
                info_url: '',
                see: this.$route.params.see || false,
                code: this.$route.params.code,
                url: {
                    list: "/api/ac/subsistence/ss15006Service/getPageList",
                    delete: "/api/ac/subsistence/ss15006Service/deleteData"
                },
                fieldsToValidate02: ["ssbd0001", "ssbd0002", "ssbd0011", "ssbd0012", "ssbd0005", "ssbd0006"],
                rules: {
                },
                possessiontype: [],
                modal: false,
                form_params: {
                    ss11001Data: {},
                    ss11002Data: [],
                    ss11003Data: [],
                    ss11004Data: [],
                    ss11005Data: [],
                    ss11006Data: [],
                    ss11007Data: [],
                    ss11008Data: [],
                    ss11009Data: [],
                    ss11010Data: [],
                    ss11012Data: [],
                    ss12001Data: {}
                },
            }
        },
        watch: {
            "dataSs11006.ssbd0002": function (value,oldVal) {
                let that = this;
                if(oldVal){
                    that.dataSs11006.ssbd0011 = undefined;
                }
                if (value == '200') {
                    that.operationalpropertytype = true;
                    that.consumergoodstype = false;
                    that.otherpropertytype = false;
                } else if (value == '300') {
                    that.operationalpropertytype = false;
                    that.consumergoodstype = true;
                    that.otherpropertytype = false;
                } else if (value == '900') {
                    that.operationalpropertytype = false;
                    that.consumergoodstype = false;
                    that.otherpropertytype = true;
                }
            }
        },
        methods: {
            prevStep () {
                this.$parent.clickStep(4);
            },
            nextStep () {
                this.$parent.clickStep(6);
            },
            nextPage() {
                this.$router.push({
                    name: 'db_houseproperty',
                    params: this.next_params
                })
            },
            handleDetail(row) {
                let that = this;
                that.title = "详情";
                that.disableSubmit = true;
                let record = row;
                if (record.id) {
                    that.modalSs11006 = true;
                    that.dataSs11006 = Object.assign({}, record);
                    that.dataSs11006.ssbd0009 = new Date(record.ssbd0009);
                    that.dataSs11006.ssbd0010 = new Date(record.ssbd0010);
                } else {
                    that.modalSs11006 = false
                }
            },
            next() {
                this.$router.push({
                    name: 'db_houseproperty',
                    params: this.next_params
                })
            },
        },
        mounted() {

        }
    }
</script>

<style scoped>
    /deep/ .ivu-form-item-error-tip {
        display: none;
    }

    .ivu-form-item {
        margin-bottom: 0px;
    }

    .itemStyle {
        width: 180px
    }
</style>
<style scoped>
    /deep/ .ivu-form-item-error-tip {
        display: none;
    }

    .ivu-form-item {
        margin-bottom: 0px;
    }

    .itemStyle {
        width: 180px
    }

    .head-img1 {
        height: 200px;
        width: 250px;
        margin-top: 15px;
    }

    .head-img {
        height: 200px;
        width: 250px;
    }

    .imgBackColor {
        background-color: WhiteSmoke;
        height: 250px;
    }

    .positiveTDiv {
        height: 240px;
        width: 75px;
        line-height: 240px;
        background-color: #7CCD7C;
        margin-bottom: 10px;
        color: white;
        font-size: 14px;
        font-weight: 700;
    }
</style>
